<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<jsp:include page="../../common/assets_header.jsp" />
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<script
	src="<%=request.getContextPath()%>/assets/js/date-time/bootstrap-datepicker.min.js"></script>
<script
	src="<%=request.getContextPath()%>/assets/js/jqGrid/jquery.jqGrid.min.js"></script>
<script
	src="<%=request.getContextPath()%>/assets/js/jqGrid/i18n/grid.locale-en.js"></script>

<script type="text/javascript"
	src="<%=request.getContextPath()%>/plugins/zTree/jquery.ztree.all.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/plugins/zTree/jquery.ztree.core.js"></script>
<link
	href="<%=request.getContextPath()%>/plugins/zTree/zTreeStyle/zTreeStyle.css"
	rel="stylesheet" type="text/css" />
<link
	href="<%=request.getContextPath()%>/plugins/zTree/metroStyle/metroStyle.css"
	rel="stylesheet" type="text/css" />


<script>
	jQuery(document).ready(function() {
		var tree = ${list};
		var parentId="${parentId}";
		if(""==parentId){
			parentId=null;
		}
		getTree(tree);
		loadGird(parentId);
		backList(parentId);
	})
	
	function  backList(parentId){
		if(null!=parentId){
			 var treeObj = $.fn.zTree.getZTreeObj("tree");
			 var sNodes = treeObj.getNodesByParam("baseLovId",parentId , null);
			 if (sNodes.length > 0) {
				 var  nodes=sNodes[0];
				 $("#"+nodes.tId+"_a").click();
			 } 
		}
		
	}
	
	
	function getTree(tree) {
		var treeNodes = tree;
		var setting = {
				callback: {
					onClick: zTreeOnClick
				},
			data : {
				key : {
					name : "paramKey",
					title : "paramKey"
				},
				simpleData : {
					enable : true,
					idKey : "baseLovId",
					pIdKey : "parentId"
				}
			}
		};

		$.fn.zTree.init($("#tree"), setting, treeNodes);
		var treeObj = $.fn.zTree.getZTreeObj("tree");
		treeObj.expandAll(true);

	}
	
	//初始化列表
	function loadGird(id){
		var grid_selector = "#grid-table";//列表对象
		var pager_selector = "#grid-pager";//列表分页对象
		jQuery(grid_selector).jqGrid({
			url : "<%=request.getContextPath()%>/base/lov/list_json",
			datatype : "json",
			postData:{"id":id},
			height: 300,
			colNames:[/*' ',*/ ' ','moduleName','paramKey','i18nParamKey','i18nOptionDesc','dataType','optionKey','optionOrder','optionDesc'],
			colModel:[
			{name:'baseLovId',index:'baseLovId', width:60, sorttype:"int", hidden: true},
			{name:'moduleName',index:'moduleName',width:90,sortable:false},
			{name:'paramKey',index:'paramKey', width:90,sortable:false},
			{name:'i18nParamKey',index:'i18nParamKey', width:90,sortable:false},
			{name:'i18nOptionDesc',index:'i18nOptionDesc', width:90,sortable:false},
			{name:'dataType',index:'dataType', width:90,sortable:false},
			{name:'optionKey',index:'optionKey', width:90,sortable:false},
			{name:'optionOrder',index:'optionOrder', width:90,sortable:false},
			{name:'optionDesc',index:'optionDesc', width:90,sortable:false}
			], 
			viewrecords : true,
			rowNum:10,
			
			rowList:[10,20,30],
			pager : pager_selector,
			altRows: true,
			multiselect: false,
			 multiboxonly: true,
			 loadComplete : function() {
				},
			//editurl: $path_base+"/dummy.html",//nothing is saved
			caption: "Lov List",
			autowidth: true
		});
	}
	
	
	//ztree 树形菜单节点点击事件
	function zTreeOnClick(event, treeId, treeNode) {
		$("#id").val(treeNode.baseLovId);
		 
		 $("#grid-table").clearGridData(false);
			var postData = $("#grid-table").jqGrid("getGridParam", "postData");
		    $.extend(postData, {"id":treeNode.baseLovId});
			$("#grid-table").trigger("reloadGrid");
		}

	function add() {
	
		var parentId=$("#id").val();
		location.href="<%=request.getContextPath()%>/base/lov/form?parentId="+parentId;
		
	}
	
	function edit(){
		 var id = $("#grid-table").jqGrid('getGridParam', 'selrow');
		 var obj = null;
		 if(id){
			 obj = $("#grid-table").jqGrid('getRowData', id);
			 id=obj.baseLovId;
			 location.href="<%=request.getContextPath()%>/base/lov/form?id="+id;
		 }else{
			 bootbox.alert({  
		            buttons: {  
		               ok: {label: '确认',className: 'btn-ok'  }  
		            },  
		            message: '请选择一行数据.',  
		            title: "提示",  
		        });
			 return;
		}
	}
	
	
	function del(){
		 var id = $("#grid-table").jqGrid('getGridParam', 'selrow');
		 var obj = null;
		 if(id){
			 obj = $("#grid-table").jqGrid('getRowData', id);
		 }else{
			 bootbox.alert({  
		            buttons: {  
		               ok: {label: '确认',className: 'btn-ok'  }  
		            },  
		            message: '请选择一行数据.',  
		            title: "提示",  
		        });
			 return;
		}
		 var susername = obj.paramKey;
		 alert(obj.paramKey);
		 var id = obj.baseLovId;
		bootbox.dialog({
			message : "<spring:message code="sure you want to delete"></spring:message>"+susername+"<spring:message code="what"></spring:message>",
			title : "<spring:message code="delete the user"></spring:message>",
			buttons : {
				confirm : {
					label : '<spring:message code="sure to delete"></spring:message>',
					className : "btn red btn-ok",
					callback : function() {
						$.ajax({
							type : "GET",
							url : "<%=request.getContextPath()%>/base/lov/del?basLovId="+id,
							dataType : 'text',
							async : false,
							success : function(data) {
								if(data=="success"){
									$("#grid-table").delRowData($("#grid-table").jqGrid('getGridParam', 'selrow'));
									var treeObj = $.fn.zTree.getZTreeObj("tree");
									var nodes = treeObj.getNodesByParam("baseLovId",id , null);
									for (var i=0, l=nodes.length; i < l; i++) {
										treeObj.removeNode(nodes[i]);
									}
									
								}else{
									noty({layout: 'center',text: "<spring:message code="delete the user failure"></spring:message>！",type: 'error', timeout: 2000 });
								}
							},
							error : function(data, status) {
								noty({layout: 'center',text: "<spring:message code="error"></spring:message>！",type: 'error', timeout: 2000 });
							}
						});
					}
				},
				cancel : {
					label : "<spring:message code="cancel"></spring:message>",
					className : "btn btn-danger"
				}
			}
		});
	}
</script>

</head>
<body>

	<div class="page-content">
		<div class="page-header">
			<button class="btn btn-xs btn-primary" onclick="add();" id="newBtn">New</button>
			<button class="btn btn-xs btn-primary" onclick="edit();" id="editBtn">Edit</button>
			<button class="btn btn-xs btn-primary" onclick="del();" id="del">Delete</button>
			<input type="hidden"  id="id" value="${basLovId }" />
		</div>


		<div class="row">
			<div class="col-sm-4">
				<div class="widget-box">
					<div class="widget-header widget-header-flat">
						<h4 class="smaller">树形菜单</h4>
					</div>

					<div class="widget-body">
						<div class="widget-main">
							<div id="tree" class="ztree"></div>
						</div>
					</div>
				</div>
			</div>

			<div id="lovList" class="col-sm-6">
				<div class="widget-box">
					<div class="widget-header widget-header-flat">
						<h4 class="smaller">lov</h4>
					</div>

					<div class="widget-body">
						<div class="widget-main">

							<!-- 列表 -->
							<table id="grid-table"></table>
							<!-- 分页 -->
							<div id="grid-pager"></div>


						</div>
					</div>
				</div>
			</div>


		</div>


	</div>

</body>